<template>
  <base-layout
    :dialog-title="dialogTitle"
    :dialog-visible="dialogVisible"
    @dialog-close="dialogClose"
    :dialogWidth="dialogWidth"
  >
    <template #searchPanel>
      <search-panel
        :addPer="authConfig.add"
        :selectPer="authConfig.query"
        addTitle="新增销售单"
        @insert="add"
        @search="search"
        :showSearchButton="true"
        :showAddButton="true"
        :showExportButton="true"
        @export="handleDataExport('Sell', '销售单')"
      >
        <job-shop
          v-model="searchOptions.storeId"
          placeholder="所属门店"
        />
        <el-select
          clearable
          style="width: 200px"
          v-model="searchOptions.storeIds"
          placeholder="全部状态"
        >
          <el-option
            v-for="item in dict['工单状态']"
            :key="item.index"
            :value="item.value"
            :label="item.text"
          />
        </el-select>
        <el-input
          v-model="searchOptions.likeName"
          clearable
          placeholder="工单编号/客户手机号/员工姓名"
          style="width: 240px"
        />
      </search-panel>
    </template>
    <template #contentPanel>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :has-action="true"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :width="160"
        @row-dblclick="rowDblclick"
      >
        <template #action="{ row }">
          <i
            class="el-icon-edit"
            title="编辑"
            style="cursor: pointer"
            v-permission="authConfig.edit"
            @click="handleDataUpdateEdit(row)"
          ></i>
          <i
            class="el-icon-delete"
            title="删除"
            style="color: red; margin-left: 20px; cursor: pointer"
            v-permission="authConfig.del"
            @click="handleDataDelete(row)"
          ></i>
        </template>
      </data-table>
    </template>
    <template #dialog>
      <dialog-view-detail
        :workOrderId="selectRow.id"
        :workOrderType="5"
        @close="dialogCloseEv"
      />
    </template>
  </base-layout>
</template>
<script>
import { sellList, addSell, deleteSell, getSellById, editSell } from '@/api/after-sale/workOrderManage/sell'
import baseMixin from '@/mixins/base'
import { JobShop } from '@/components/index'
import { getDict, exportExcel } from '@/utils'
import DialogViewDetail from '../view/index.vue'
export default {
  components: { JobShop, DialogViewDetail },
  mixins: [
    baseMixin({
      findData: sellList,
      addData: addSell,
      deleteData: deleteSell,
      dataName: ['content', 'totalRecords'],
      isAdd: false,
      findDataById: getSellById,
      updateData: editSell,
      idName: 'id'
    }),
  ],
  data () {
    return {
      authConfig: {
        query: 'sell:page',
        add: 'sell:save',
        edit: 'sell:update',
        del: 'sell:del',
        status: 'sell:status'
      },
      dialogVisible: false,
      dialogWidth: '1200px',
      tableColumnAttributes: [
        { name: '所属门店', value: 'storeName', type: 'text' },
        { name: '工单编号', value: 'workOrderCode', type: 'text' },
        { name: '单据日期', value: 'receiptsTime', type: 'text' },
        { name: '客户姓名', value: 'clientName', type: 'text' },
        { name: '性别', value: 'genderCst', type: 'text' },
        { name: '客户联系方式', value: 'phone', type: 'text' },
        { name: '销售人员', value: 'receptionName', type: 'text' },
        { name: '销售配件数', value: 'partsNumber', type: 'text' },
        { name: '销售精品数', value: 'jpNumber', type: 'text' },
        { name: '付款状态', value: 'payStatus', type: 'text' },
        { name: '状态', value: 'status', type: 'text' },
        { name: '工单总金额', value: 'amount', type: 'text' },
        { name: '工单备注', value: 'remark', type: 'text' },
        { name: '录入时间', value: 'createTime', type: 'text' },
      ],
      dict: {},
    }
  },
  async created () {
    this.dict = getDict(['工单状态'], "", true);
    this.dict.length = 4
  },
  methods: {
    rowDblclick (row) {
      this.selectRow = row;
      this.dialogVisible = true;
      this.dialogTitle = "工单详情"
    },
    dialogCloseEv () {
      this.dialogClose();
      this.setTableData();
    },
    search (form) {
      // this.searchOptions = {
      //   source: form.source,
      //   levelId: form.levelId,
      //   type: form.type,
      //   key: form.key,
      //   storeId: form.storeId
      // }
      this.currentPage = 1
      this.setTableData()
    },
    add () {
      this.$router.push({ path: '/workOrderManage/create-sell' })
    },
    handleDataUpdateEdit (row) {
      this.$router.push({ path: '/workOrderManage/edit-sell', query: { id: row.id } });
    },
    //导出
    excelInfo () {
      exportExcel("Sell", "销售单", {}, this.pageSize, this.currentPage);
    },
  },
}
</script>